<template>
  <div class="content">
    <ul class="mt-10">
      <li>
        <div class="my-title" @click="showOrHide">
          第一部分：订单方式
        </div>
        <ul v-show="isShow">
          <li class="my-con">
            <div class="question">
              Q:怎样查看我的订单？
            </div>
            <div class="answer">
              A:1、请在微商城登录您的会员账户，点击 <span>【我的】</span>- <span>【全部订单】</span>- <span>【待付款、发货、待收货等】。</span> 2.找到您想要查询的订单，点击订单进入，会显示订单最新状态和详情。
            </div>
          </li>
        </ul>
      </li>
      <li>
        <div class="my-title" @click="showOrHide">
          第二部分：物流配送
        </div>
        <ul v-show="isShow">
          <li class="my-con">
            <div class="question">
              Q:配送费用如何收取？
            </div>
            <div class="answer">
              A:按品类收取配送费，白酒、红酒类商品免配送费，啤酒1箱起送，免配送费。
            </div>
          </li>
        </ul>
      </li>
    </ul>

  </div>
</template>

<script>
  export default {
    components: {
    },
    data(){
      return {
          isShow:false
      };
    },
    mounted(){

    },
    methods: {
      showOrHide(){
          if(this.isShow){
            this.isShow = false;
          }else{
            this.isShow = true;
          }
      }
    },
    filters: {}
  }
</script>

<style scoped>
  .content {
    text-align: left;
    background: #fff;
  }

  .mt-10{
    margin-top: .5rem;
  }

  .my-title {
    background: #F9F9F9;
    border-bottom: 1px solid #ededed;
    padding: .5rem .75rem;
    font-size: .7rem;
    color: #333333;
    font-weight: bold;
  }
  .my-con {
    padding: .5rem .75rem;
    line-height: 1rem;
  }
  .question {
    color: #333;
    font-size: .65rem;
    font-weight: bold;
  }
  .answer{
    font-size: .65rem;
    color: #555;
  }
  .answer span{

    color: #ff817a;
  }

</style>
